<template>
  <c-form-item :label="label" :prop="prop" :required="required" :span="span">
    <el-date-picker v-model="dataValue" :type="types" @change="changevalue" prefix-icon="iconfont iconblack iconziyuan1"
      :disabled="disabled" :value-format="valueformat">
    </el-date-picker>
  </c-form-item>
</template>

<script>
export default {
  name: 'c-date',
  props: {
    label: {
      type: String,
      default: ''
    },
    value: {
      default: null
    },
    prop: {
      type: String,
      default: null
    },
    required: {
      type: Boolean,
      default: false
    },
    types: {
      type: String,
      default: 'date'
    },
    disabled: {
      type: Boolean,
      default: false
    },
    span: {
      type: Number,
      default: 8
    },
    valueformat: {
      default: 'yyyy-MM-dd HH:mm:ss'
    }
  },
  data() {
    return {
      itemRules: null,
      dataValue: null
    }
  },
  methods: {
    changevalue(value) {
      this.$emit('input', value)
    },
    changeRequire() {
      if (this.required === true) {
        this.itemRules = [
          {
            required: true,
            message: '不能为空',
            trigger: 'blur'
          }
        ]
      } else {
        this.itemRules = null
      }
    },
    updateValue(val) {
      this.$emit('input', val)
    }
  },
  watch: {},
  computed: {},
  mounted() {
    this.changeRequire()
    this.dataValue = this.value
  }
}
</script>

<style scoped>
</style>